<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 <link rel="stylesheet" type="text/css" href="css/css/easyui.css">
    <link rel="stylesheet" type="text/css" href="css/css/icon.css">
    <link rel="stylesheet" type="text/css" href="css/css/demo.css">
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>	
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Order Book</title>
<script type="text/javascript">
window.onload=$(document).ready(function() {  	
	$.get('./tradeBook',function(responseJson) {
	 var confirm_buy=0;
	var confirm_sell=0;
	var pending_sell=0;
	var pending_buy=0;
            if(responseJson!=null){  
            	
            	for(var i=0; i<responseJson.length; i++ ){            		
            		
            	 
            		if(responseJson[i]['type'] == 'BUY'){
						
					        if(responseJson[i]['status'] == 'Executed'){
							  confirm_buy++;
							
							}else if(responseJson[i]['status'] == 'Pending'){
							   pending_buy++;
							}
					 	
					 }else if(responseJson[i]['type'] == 'SELL'){
					 
					        if(responseJson[i]['status'] == 'Executed'){
							  confirm_sell++;
							
							}else if(responseJson[i]['status'] == 'Pending'){
							   pending_sell++;
							}
					 	
					 }
            	}
               	
               
				 document.getElementById('pendingbuy').value=pending_buy;
				 document.getElementById('pendingsell').value=pending_sell;
				 document.getElementById('confirmbuy').value=confirm_buy;
				 document.getElementById('confirmsell').value=confirm_sell;
	      
             }           
      });
      // 
});
</script>
</head>

<body>
<div  style="width:1200px;">



<table id ="tt" class="easyui-datagrid" style="width:1200px;height:150px;" data-options="singleSelect:true,collapsible:true,url:'./tradeBook',method:'GET'">      
<thead>
            <tr>
                <th data-options="field:'id',width:80">Item ID</th>
                <th data-options="field:'brokeId',width:80">Broke ID</th>
                <th data-options="field:'otype',width:100">Condition Type</th>
                <th data-options="field:'insname',width:80,">Instrument Name</th>
                <th data-options="field:'symbol',width:80">Symbol</th>
                <th data-options="field:'expdate',width:250">Expiry/Series</th>
                <th data-options="field:'qt',width:60">Total Quantity</th>
                <th data-options="field:'ql',width:80">Total Lots</th>
                <th data-options="field:'qw',width:100">Total Weight</th>
                <th data-options="field:'price',width:80,">Price</th>
                <th data-options="field:'ptype',width:80">Product Type</th>
                <th data-options="field:'tp',width:250">Trigger Price</th>
                <th data-options="field:'ts',width:60">TimeStamp</th>
                 <th data-options="field:'type',width:250">Order Type B/S</th>
                <th data-options="field:'user_id',width:60">USER ID</th>
                <th data-options="field:'status',width:60">Status</th>
               
            </tr>
        </thead>
    </table>
</div>
<footer>
<p>For He</p><p>All Order for All Securities for All Order Type for All for All Strategies for All Mapping</p>
<p>PendingQty(Buy): <input type="text" readonly="true" id="pendingbuy"  /></p>
<p>PendingQty(Sell): <input type="text" readonly="true" id="pendingsell" /></p>
<p>BuyQty: <input type="text" readonly="true" id="confirmbuy" /></p>
<p>SellQty: <input type="text" readonly="true" id="confirmsell" /></p>

</footer>
</body>
</html>